{% extends 'base.html' %}

{% block  css-page %}

    <link href="/static/datatable/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" rel="stylesheet">

    <!-- DataTables Responsive CSS -->
    <link href="/static/datatable/datatables-responsive/css/dataTables.responsive.css" rel="stylesheet">
{% endblock %}

{% block page-content %}
 <div class="row">
                <div class="col-lg-12">
                    <h1 class="page-header">域名管理</h1>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <!-- /.row -->
            <div class="row">
                <div class="col-lg-12">
                    <p>
                        <a  href="{% url 'domain_add' %}"><button class="btn btn-primary " type="button">添加域名</button></a>
                    </p>
                </div>

                <div class="col-lg-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            域名列表信息
                        </div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <div class="dataTable_wrapper">
                                <table class="table table-striped table-bordered table-hover" id="dataTables-example">
                                    <thead>
                                        <tr>
                                            <th>域名</th>
                                            <th>提供商</th>
                                            <th>提供商联系人</th>
                                            <th>联系方式</th>
                                            <th>域名负责人</th>
                                            <th>解析IP</th>
                                            <th>到期时间</th>
                                            <th>过期状态</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="odd gradeX">
                                            <td>www.baidu.com</td>
                                            <td>蓝讯</td>
                                            <td>张三</td>
                                            <td class="center">1355555555</td>
                                            <td class="center">张在</td>
                                            <td class="center">192.4.5.3</td>
                                            <td class="center">2015-08-2</td>
                                            <td class="center">到期</td>

                                        </tr>
                                            <tr class="odd gradeX">
                                            <td>www.baidu.com</td>
                                            <td>蓝讯</td>
                                            <td>张三</td>
                                            <td class="center">1355555555</td>
                                            <td class="center">张在</td>
                                            <td class="center">192.4.5.3</td>
                                            <td class="center">2015-08-2</td>
                                            <td class="center">到期</td>

                                        </tr>
                                        <tr class="odd gradeX">
                                            <td>www.baidu.com</td>
                                            <td>蓝讯</td>
                                            <td>张三</td>
                                            <td class="center">1355555555</td>
                                            <td class="center">张在</td>
                                            <td class="center">192.4.5.3</td>
                                            <td class="center">2015-08-2</td>
                                            <td class="center">到期</td>

                                        </tr>
                                        <tr class="odd gradeX">
                                            <td>www.baidu.com</td>
                                            <td>蓝讯</td>
                                            <td>张三</td>
                                            <td class="center">1355555555</td>
                                            <td class="center">张在</td>
                                            <td class="center">192.4.5.3</td>
                                            <td class="center">2015-08-2</td>
                                            <td class="center">到期</td>

                                        </tr>
                                        <tr class="odd gradeX">
                                            <td>www.baidu.com</td>
                                            <td>蓝讯</td>
                                            <td>张三</td>
                                            <td class="center">1355555555</td>
                                            <td class="center">张在</td>
                                            <td class="center">192.4.5.3</td>
                                            <td class="center">2015-08-2</td>
                                            <td class="center">到期</td>

                                        </tr>

                                    </tbody>
                                </table>
                            </div>
                            <!-- /.table-responsive -->

                        </div>
                        <!-- /.panel-body -->

                    </div>
                    <!-- /.panel -->
                </div>
            </div>
            <!-- /.row -->

{%endblock%}


    {% block  script-page %}
            <script src="/static/datatable/datatables/media/js/jquery.dataTables.min.js"></script>
            <script src="/static/datatable/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>

            <!-- Custom Theme JavaScript -->

            <!-- Page-Level Demo Scripts - Tables - Use for reference -->
            <script>
           $(document).ready(function() {
                $('#dataTables-example').DataTable({
                        responsive: true,
                        "bSort": false,
                        "oLanguage":{
                                "sZeroRecords":"查询不到任何相关数据",
                                "sSearch": "搜索:",
                                "sLengthMenu": "每页显示 _MENU_ 条记录",
                                "oPaginate": {
                                          "sFirst":    "第一页",
                                          "sPrevious": " 上一页 ",
                                          "sNext":     " 下一页 ",
                                          "sLast":     " 最后一页 "
                                      },
                                "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
                        }
                });
            });
            </script>
    {% endblock %}